<template>
	<!-- 搜索栏提取组件 -->
  <view class="content">
    <cu-custom bgColor="bg-gradual-blue" :isBack="true">
    	<block slot="backText">返回</block>
    	<block slot="content">职位详情</block>
    </cu-custom>
    
    <list></list>
    
    <!-- 职位描述 -->
    <view class="desc">
      <view class="title">职位描述</view>
      <view>
        <view class="sub-title">岗位职责</view>
        <view class="desc-content">1.根据美团平台提示商家地址取餐</view>
      </view>
      <view class="company-info">公司信息：上海凌云网络科技有限公司</view>
      <view class="distance">
        <view>松江新城地铁站</view>
        <view>距离你1km</view>
      </view>
    </view>
    
    <map class="map"></map>
    
    <view class="bottom">
      <view>邀请好友得现金</view>
      <view>报名中（2人想去）</view>
    </view>

  </view>
</template>

<script>  
  import list from "@/components/list/list.vue";
  export default {
    data() {
      return {
      }
    },
    onLoad(e) {
      console.log(e);
    },
    methods: {
      
    },
    components: {
      list,
    }
  }
</script>

<style lang="scss">
  .content {
    height: 400upx;
  }
  .desc {
    padding: 0 40upx;
    .title {
      font-size: 38upx;
      margin: 40upx 0 20upx 0;
    }
    .sub-title {
      color: #686868;
      margin: 20upx 0;
    }
    .desc-content {
      color: #686868;
    }
    .company-info {
      font-size: 32upx;
      padding: 20upx 0;
      margin-bottom: 20upx;
      border-bottom: 1px solid #aaaaaa;
    }
    .distance {
      margin-bottom: 20upx;
      view:first-child {
        font-size: 32upx;
        padding:10upx 0;
      }
      view:last-child {
        color: #02a7ff;
      }
    }
  }
  .map {
    width: 100%;
    height: 400upx;
  }
  .bottom {
    position: fixed;
    height: 120upx;
    width: 100%;
    background: #fff;
    bottom: 0;
    display: flex;
    justify-content: space-around;
    align-items: center;
    view:last-child {
      padding: 20upx 0;
      width: 40%;
      text-align: center;
      border-radius: 5px;
      align-items: center;
      color: #fff;
      background: #007AFF;
    }
  }
</style>
